import { Button, Space } from 'antd'
import cs from 'classnames'
import { useContext, useEffect, useRef, useState } from 'react'

import OCRIdCard from '@/components/OCRIdCard'
import SignatureCanvas from '@/components/Signature'
import UploadFile from '@/components/UploadFile'
import { GlobalContext } from '@/context'

function Dashboard() {
  const { setLang } = useContext(GlobalContext)

  //监听为同步数据
  useEffect(() => {}, [])

  const [path, setPath] = useState()

  const uploadRef = useRef(null)
  const onFile = (path) => {
    console.log(path)
    setPath(path[0].path)
  }
  const onReadFile = () => {
    const { fileName, fileType, data } = window.electron.ipcRenderer.readFiles(path)
    console.log(fileName, fileType, data)
    const file = new File([data], fileName)
    console.log(file)
  }
  const removeFile = () => {
    window.electron.ipcRenderer.removeFiles(path)
  }

  const [base64, setBase64] = useState<string>(null)
  const upload = async () => {
    // try {
    //   const data = await fileUpload([{ key: 'file', path: path }])
    //   // 处理上传完成的文件信息
    //   console.log(data)
    // } catch (error) {
    //   console.error('上传失败', error)
    //   // 处理上传失败的情况
    // }
  }

  const OCRIdCardRef = useRef(null)
  const onOCRIdCard = () => {
    OCRIdCardRef.current.open()
  }
  const onData = (e) => {
    console.log(e)
    //{eid: '784-1991-4114931-2', name: 'Qinlong Zhou', nameArabic: 'فينلونج زهو', nationality: 'China', nationalityArabic: 'الصين'}
  }

  return (
    <div className="pt-16">
      <OCRIdCard ref={OCRIdCardRef} onData={onData} />
      <UploadFile ref={uploadRef} onFile={onFile} />
      <button onClick={removeFile}>删除</button>
      <button onClick={() => uploadRef.current.open()}>上传</button>
      <button onClick={onReadFile}>读取</button>
      <button onClick={upload}>同步到服务器</button>
      <button onClick={onOCRIdCard}>身份证识别</button>
      <div className=" w-96 h-96 bg-slate-100">
        <SignatureCanvas value={base64} onchange={(e) => setBase64(e)} />
      </div>
    </div>
  )
}

export default Dashboard
